<template>
  <table class="table">
    <tbody class="options">
    <tr v-for="(item,index) in options" :key="index">
      <td class="one">
        <img :src="item.ICON_URL">
      </td>
      <td class="two">
        <div>{{item.TITLE}}</div>
        <div>{{item.CONFIG_VALUE.content}}</div>
      </td>
      <td class="three">
        <span class="bonus">+{{item.CONFIG_PARAM}}</span>
        <router-link v-if="item.CONFIG_VALUE.task == 'zrw'" :to="item.CONFIG_VALUE.taskurl" class="btn btn-task">做任务 <i class="iconfont icon-xiangyou"></i></router-link>
        <router-link v-else-if="item.CONFIG_VALUE.task == 'ck'" :to="item.CONFIG_VALUE.taskurl" class="btn btn-view">查看</router-link>
        <router-link v-else :to="item.CONFIG_VALUE.taskurl" class="btn btn-view invisible"></router-link>
      </td>
    </tr>
    </tbody>
  </table>
</template>

<script>
  export default {
    props: {
      tasks: {
        type: Array
      }
    },
    computed: {
      options () {
        let options = [];
        for(let i=0;i<this.tasks.length;i++){
          let task = this.tasks[i];
          Object.assign(task,{
            "CONFIG_VALUE": JSON.parse(task.CONFIG_VALUE)
          });
          options.push(task)
        }
        return options
      }
    }
  }
</script>
